<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body>
    <script>
      const arr = [
        {
          id: '1195268474480156673',
          pid: '1',
          level: null,
          children: [
            {
              id: '1195268616021139457',
              pid: '1195268474480156673',
              level: null,
              children: [],
              select: null,
              name: '用户管理',
              type: '1',
              permissionValue: null,
              path: 'user/list',
              component: '/acl/user/list',
              icon: null,
              status: 1,
              isDeleted: 0,
              createTime: '2022-07-28 20:00:00',
              modifyTime: null
            },
            {
              id: '1195268788138598401',
              pid: '1195268474480156673',
              level: null,
              children: [],
              select: null,
              name: '角色管理',
              type: '1',
              permissionValue: null,
              path: 'role/list',
              component: '/acl/role/list',
              icon: null,
              status: 1,
              isDeleted: 0,
              createTime: '2022-07-28 20:00:00',
              modifyTime: null
            },
            {
              id: '1195268893830864898',
              pid: '1195268474480156673',
              level: null,
              children: [],
              select: null,
              name: '菜单管理',
              type: '1',
              permissionValue: null,
              path: 'menu/list',
              component: '/acl/menu/list',
              icon: null,
              status: 1,
              isDeleted: 0,
              createTime: '2022-07-28 20:00:00',
              modifyTime: null
            }
          ],
          select: null,
          name: '权限管理',
          type: '1',
          permissionValue: null,
          path: '/acl',
          component: 'Layout',
          icon: null,
          status: 1,
          isDeleted: 0,
          createTime: '2022-07-28 20:00:00',
          modifyTime: null
        }
      ]

      const finalArr = []
      function handlerMenuList(arr) {
        arr.forEach((item) => {
          const { path, name, component } = item
          let newObj = {}
          newObj = { path, name, component }
          if (item.children && item.children.length) {
            // 处理子项
            newObj.children = getSelectChildrenArr(item.children)
          }
          finalArr.push(newObj)
        })
        return finalArr
      }

      function getSelectChildrenArr(children) {
        const temArr = []
        children.forEach((child) => {
          if (child.children && child.children.length) {
            handlerMenuList(child.children)
          } else {
            let temObj = {}
            const { path, name, component } = child
            temObj = { path, name, component }
            temArr.push(temObj)
          }
        })
        return temArr
      }

      const res = handlerMenuList(arr)
      console.log(res)
    </script>
  </body>
</html>
